<template>
  <p-form-model
    :model="form"
    :label-col="{ span: 6 }"
    :rules="rules"
    layout="inline"
  >
    <p-form-model-item label="线索编号">
      <p-input v-model="form.leadsNo" placeholder="请输入" />
    </p-form-model-item>
    <p-form-model-item label="线索名称">
      <p-input v-model="form.leadsName" placeholder="请输入" />
    </p-form-model-item>
    <p-form-model-item label="客户简称">
      <p-input v-model="form.customerShortName" placeholder="请输入" />
    </p-form-model-item>
    <p-form-model-item label="销售组织">
      <SelectOrg v-model="form.salesOrgCode" />
    </p-form-model-item>
    <p-button type="primary" @click="handleSearch">
      搜索
    </p-button>
    <p-form-model-item label="线索状态">
      <SelectDefault v-model="form.leadsStatus" code="leads_status" />
    </p-form-model-item>
    <p-form-model-item label="转派状态">
      <SelectDefault
        v-model="form.transferStatus"
        code="leads_transfer_status"
      />
    </p-form-model-item>
    <p-form-model-item label="转商机审批">
      <SelectDefault
        v-model="form.businessAuditStatus"
        code="leads_trans_biz_status"
      />
    </p-form-model-item>
    <p-form-model-item label="创建人">
      <p-input v-model="form.createUserName" placeholder="请输入" />
    </p-form-model-item>
    <p-button class="btn-search" @click="handleReset">重置</p-button>
    <p-button @click="handleExport">导出</p-button>
  </p-form-model>
</template>
<script>
const defaultForm = {
  leadsNo: undefined,
  leadsName: undefined,
  customerShortName: undefined,
  salesOrgCode: undefined,
  leadsStatus: undefined,
  transferStatus: undefined,
  businessAuditStatus: undefined,
  createUserName: undefined,
};
export default {
  data() {
    return {
      col: 4,
      row: 1,
      gutter: 24,
      form: {
        ...defaultForm,
      },
    };
  },
  methods: {
    handleSearch() {
      this.$emit('search', this.form);
    },
    handleReset() {
      this.form = { ...defaultForm };
      this.$emit('search', this.form);
    },
    handleExport() {
      this.$emit('export');
    },
  },
};
</script>

<style lang="less" scoped>
.poros-form {
  box-sizing: border-box;
  background-color: #f7f7f8;
  padding: 10px;
  padding-bottom: 0px;
  width: 100%;
}
.poros-form-item {
  width: 20%;
  margin-bottom: 10px;
}
/deep/ .poros-form-item-control-wrapper {
  width: calc(100% - 70px);
}
.btn-search {
  margin-right: 16px;
}
// /deep/ .poros-form-item-label {
//   white-space: normal;
// }
/deep/ .poros-form-item-label {
  width: 70px;
}
</style>
